<template>
<div v-if="this.code">
  <el-popover
    placement="top-start"
    width="200"
    trigger="hover">
    <div class="qrcode-show" v-for="(item, index) in code" :key="index">
      <img
      id="qrcode"
      :src = "url[index]"
      :style="{'width': '180px'}"
      alt="" />
      <p>【{{item.versionName}}】</p>
      <p>{{item.description}}</p>
    </div>
    <a
      slot="reference"
      class="iconfont icon-meterReading"
      :style="{'font-size': '20px'}">
    </a>
  </el-popover>
</div>
</template>
<script>
import QRCode from 'qrcode'
export default {
  props: {
    width: {
      type: Number,
      default: 200
    },
    tips: {
      type: String,
      default: '扫一扫下载APP'
    }
  },
  mounted () {
    this.getAppVersion()
    // let codeDiv = document.getElementById('qrcode')
  },
  data () {
    return {
      code: null,
      url: []
    }
  },
  methods: {
    getAppVersion () {
      this.$get({
        url: '/dxbase/version/android'
      }).then(data => {
        if (!data) return
        this.code = [data]
        QRCode.toDataURL(data.url).then(url => {
          this.url.push(url)
        })
      })
    }
  }
}
</script>
<style scoped>
p{
  text-align: center;
  padding: 5px 0;
  margin-bottom: 0;
}
</style>
